﻿@{
    Layout = null;
}
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Login3</title>
    <!-- 引入样式 -->
    <link href="~/lib/element-ui/index.css" rel="stylesheet" />
    <script src="~/js/axios.min.js"></script>
    <script src="~/js/vue2.js"></script>
    <!-- 引入组件库 -->
    <script src="~/lib/element-ui/index.js"></script>
</head>
<body>
    <div id="app">
        <div class="login-pad">
            <div class="login-title">
                后台管理系统 {{ message }}
            </div>
            <div class="login-content">
                <el-row>
                    <el-form ref="form" :model="form" :rules="rules"  label-width="80px">
                        <el-form-item label="用户名" prop="no">
                            <el-input v-model="form.no"></el-input>
                        </el-form-item>
                        <el-form-item label="密码" prop="password">
                            <el-input v-model="form.password" show-password></el-input>
                        </el-form-item>
                    </el-form>
                </el-row>
                <el-row>
                    <el-button style="width:100%;" type="primary" v-on:click="login(2)">登录</el-button>
                </el-row>
            </div>
        </div>
    </div>
    <style type="text/css">
        .login-pad {
            width: 600px;
            height: 400px;
            margin: auto;
            margin-top: 10%;
            box-shadow: 0px 0px 10px rgba(0,0,0,0.36);
            border-radius: 6px;
        }
        .login-title {
            font-size: 28px;
            height: 76px;
            line-height: 76px;
            text-align: center;
            border-bottom: 1px solid #ccc;
        }
        .login-content {
            padding: 0px 10%;
        }
        .login-content .el-row {
            margin-top: 36px;
        }
    </style>
    <script>
        var vm = new Vue({
            el: "#app",
            data: {
                message: "",
                form: {
                    no: 'no1',
                    password: "123456",
                },
                rules: {
                    no: [
                        { required: true, message: '请输入用户名', trigger: 'blur' },
                    ],
                    password: [
                        { required: true, message: '请输入密码', trigger: 'blur' }
                    ],
                },
            },
            methods: {
                login: function (type) {
                    console.log('按钮被点击了！');
                    var url = type == 2 ? "/Home/CheckLogin2" : "/Home/CheckLogin";
                    axios.get(url + "?no=" + vm.form.no + "&password=" + vm.form.password).then(function (res) {
                        //vm.message = res.data.name;
                        console.log(res.data);
                    });
                }
            },
            mounted() {
                //this.login(1);
            },
        });
    </script>
</body>
